<template>
	<view class="noticeDetail">
		<u-navbar :border-bottom="false" title="请假通知" ></u-navbar>
		<view class="student acea-row row-middle">
			<image :src="info.headimg?baseUrl+info.headimg:'../../../static/images/noticeDetail-student-default.png'" mode=""></image>
			<text>{{info.title}}</text>
		</view>
		<view class="detail">
			<view class="title">请假详情</view>
			<view class="content acea-row row-column">
				<view class="item acea-row">
					<text>上课时间</text>
					<view class="time acea-row row-middle row-column">
						<text>{{info.start_date}}</text>
						<text>|</text>
						<text>{{info.end_date}}</text>
					</view>
				</view>
				<view class="item acea-row row-middle">
					<text>申请时间</text>
					<text>{{info.dateline}}</text>
				</view>
				<view class="item acea-row row-middle">
					<text>请假原因</text>
					<text>{{item.content?item.content:'无'}}</text>
				</view>
				<view class="item acea-row row-middle">
					<text>处理状态</text>
					<text :style="'color:'+(info.status == 1?'#1661FF':'#FF4D4F')+';'">{{info.status | changeStatus}}</text>
				</view>
			</view>
		</view>
		<view :style="'height: calc(152rpx + '+iosSafeBottom+'px + '+SafeBottom+'rpx);'"></view>
		<view class="footer acea-row row-middle row-between" :style="'padding-bottom: calc('+iosSafeBottom+'px + '+SafeBottom+'rpx);box-sizing: content-box;'">
			<view class="btn btn1" @click="agree(3)">不同意</view>
			<view class="btn btn2" @click="agree(2)">同意</view>
		</view>
	</view>
</template>

<script>
	import common from '../../../api/common.js'
	import request from '../../../api/request.js'
	const app = getApp()
	export default{
		data(){
			return{
				id:'',
				baseUrl:app.globalData.baseUrl,
				iosSafeBottom:app.globalData.iosSafeBottom,
				SafeBottom:app.globalData.iosSafeBottom==0?'24':'-24',
				info:{}
			}
		},
		onLoad(e) {
			this.id = e.id
			this.getDetail()
		},
		methods:{
			getDetail(){
				request.go((e)=>{
					this.info = e.data
				},'/tongzhi/view',{id:this.id},"POST")
			},
			agree(e){
				let data = {
					status:e,
					id:this.id,
				}
				request.go((e)=>{
					uni.showToast({
						icon:'none',
						title:'处理成功',
						duration:600
					})
					setTimeout(()=>{
						uni.navigateBack({})
					},600)
				},'/tongzhi/apply',data,"POST")
			}
		},
		filters:{
			changeStatus(e){
				switch(e){
					case "1":
						return '待处理'
					break;
					case "2":
						return '同意'
					break;
					case "3":
						return '拒绝'
					break;
				}
			}
		},
	}
</script>

<style scoped>
	.noticeDetail{
		min-height: 100vh;
		background-color: #F7F8FA;
	}
	.noticeDetail .student{
		width: 686rpx;
		height: 144rpx;
		background: #ffffff;
		border-radius: 24rpx;
		margin: 32rpx auto;
		padding: 32rpx 0 32rpx 32rpx;
		box-sizing: border-box;
	}
	.noticeDetail .student image{
		width: 80rpx;
		height: 80rpx;
		margin-right: 24rpx;
		display: block;
		border-radius: 50%;
	}
	.noticeDetail .student text{
		font-size: 36rpx;
		font-family: PingFang SC, PingFang SC-Medium;
		font-weight: 700;
		color: #1f2329;
		line-height: 52rpx;
	}
	.noticeDetail .detail{
		width: 686rpx;
		background: #ffffff;
		padding: 0 32rpx 32rpx 32rpx;
		box-sizing: border-box;
		margin: 0 auto;
	}
	.noticeDetail .detail .title{
		height: 108rpx;
		border-bottom: 2rpx solid #ebedf0;
		line-height: 108rpx;
		font-size: 32rpx;
		font-family: PingFang SC, PingFang SC-Medium;
		font-weight: 700;
		text-align: LEFT;
		color: #1f2329;
	}
	.noticeDetail .detail .content .item{
		margin-top: 24rpx;
	}
	.noticeDetail .detail .content .item .time text{
		font-size: 28rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #1f2329 !important;
		line-height: 40rpx;
		margin-left: 20rpx;
	}
	.noticeDetail .detail .content .item text{
		display: block;
	}
	.noticeDetail .detail .content .item text:nth-child(1){
		font-size: 28rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #8f959e;
		line-height: 40rpx;
	}
	.noticeDetail .detail .content .item text:nth-child(2){
		font-size: 28rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #1f2329;
		line-height: 40rpx;
		margin-left: 20rpx;
	}
	.noticeDetail .footer{
		position: fixed;
		bottom: 0;
		left: 0;
		width: calc(100% - 80rpx);
		height: 120rpx;
		background: #ffffff;
		padding-left: 40rpx;
		padding-right: 40rpx;
		box-sizing: border-box;
	}
	.noticeDetail .footer .btn{
		width: 311rpx;
		height: 88rpx;
	}
	.noticeDetail .footer .btn1{
		line-height: 88rpx;
		border: 2rpx solid #c0c4cc;
		font-size: 32rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #1f2329;
		text-align: center;
	}
	.noticeDetail .footer .btn2{
		line-height: 88rpx;
		font-size: 32rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #ffffff;
		text-align: center;
		background: #1661ff;
	}
</style>
